﻿<navfx:HostPage x:Class="NavFx.NavFxDemoVB.Shell"
				xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
				xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
				xmlns:navfx="clr-namespace:NavFx;assembly=NavFx"
				HorizontalAlignment="Stretch"
				VerticalAlignment="Stretch">
	<navfx:HostPage.Resources>

		<!-- resources used in styles -->
		<LinearGradientBrush x:Key="titleBackground"
							 StartPoint="0,0"
							 EndPoint="1,0">
			<GradientStop Color="Blue"
						  Offset="0.0" />
			<GradientStop Color="DarkBlue"
						  Offset="1.0" />

		</LinearGradientBrush>

		<!-- styles for specific elements -->
		<Style x:Key="titlePanelStyle"
			   TargetType="Border">
			<Setter Property="Height"
					Value="50" />
			<Setter Property="MinHeight"
					Value="50" />
			<Setter Property="Background"
					Value="{StaticResource titleBackground}" />
			<Setter Property="HorizontalAlignment"
					Value="Stretch" />
			<Setter Property="BorderThickness"
					Value="1" />
			<Setter Property="CornerRadius"
					Value="5" />
			<Setter Property="BorderBrush"
					Value="Gray" />

		</Style>

		<Style x:Key="titleTextStyle"
			   TargetType="TextBlock">
			<Setter Property="Foreground"
					Value="White" />
			<Setter Property="HorizontalAlignment"
					Value="Left" />
			<Setter Property="VerticalAlignment"
					Value="Bottom" />
			<Setter Property="Margin"
					Value="3" />
			<Setter Property="FontSize"
					Value="30" />
		</Style>

		<Style x:Key="subTitleTextStyle"
			   TargetType="TextBlock">
			<Setter Property="Foreground"
					Value="Yellow" />
			<Setter Property="HorizontalAlignment"
					Value="Left" />
			<Setter Property="VerticalAlignment"
					Value="Bottom" />
			<Setter Property="Margin"
					Value="10" />
		</Style>

		<Style x:Key="versionTextStyle"
			   TargetType="TextBlock">
			<Setter Property="Foreground"
					Value="White" />
			<Setter Property="TextAlignment"
					Value="Right" />
			<Setter Property="HorizontalAlignment"
					Value="Stretch" />
			<Setter Property="VerticalAlignment"
					Value="Bottom" />
			<Setter Property="Margin"
					Value="10" />
		</Style>

		<Style x:Key="outputPanelStyle"
			   TargetType="Border">

			<Setter Property="Background"
					Value="LightGray" />
			<Setter Property="HorizontalAlignment"
					Value="Stretch" />
			<Setter Property="VerticalAlignment"
					Value="Stretch" />
			<Setter Property="BorderThickness"
					Value="1" />
			<Setter Property="CornerRadius"
					Value="5" />
			<Setter Property="BorderBrush"
					Value="Gray" />
			<Setter Property="Height"
					Value="150" />
		</Style>

		<Style x:Key="outputPanelText"
			   TargetType="TextBlock">
			<Setter Property="HorizontalAlignment"
					Value="Left" />
			<Setter Property="FontSize"
					Value="12" />
			<Setter Property="Margin"
					Value="2" />
		</Style>

		<Style x:Key="registeredPagesStyle"
			   TargetType="ListBox">
			<Setter Property="MinHeight"
					Value="150" />
			<Setter Property="Margin"
					Value="3" />
		</Style>

		<Style x:Key="contentViewerStyle"
			   TargetType="ScrollViewer">

			<Setter Property="HorizontalScrollBarVisibility"
					Value="Disabled" />
			<Setter Property="VerticalScrollBarVisibility"
					Value="Auto" />
			<Setter Property="BorderBrush"
					Value="White" />
			<Setter Property="HorizontalAlignment"
					Value="Stretch" />
			<Setter Property="VerticalAlignment"
					Value="Stretch" />

		</Style>

		<!-- generic styles applicable to multiple elements-->
		<Style x:Key="labelStyle"
			   TargetType="TextBlock">
			<Setter Property="HorizontalAlignment"
					Value="Left" />
			<Setter Property="Margin"
					Value="3" />
			<Setter Property="FontSize"
					Value="12" />
		</Style>

		<Style x:Key="navButtonStyle"
			   TargetType="Button">
			<Setter Property="Height"
					Value="25" />
			<Setter Property="Margin"
					Value="2" />
		</Style>

		<Style x:Key="buttonTextStyle"
			   TargetType="TextBlock">
			<Setter Property="HorizontalAlignment"
					Value="Center" />
			<Setter Property="Margin"
					Value="2" />
			<Setter Property="FontSize"
					Value="10" />
		</Style>

		<Style x:Key="checkboxStyle"
			   TargetType="CheckBox">
			<Setter Property="Margin"
					Value="3" />
		</Style>

		<Style x:Key="panelBorderStyle"
			   TargetType="Border">

			<Setter Property="Background"
					Value="White" />
			<Setter Property="VerticalAlignment"
					Value="Stretch" />
			<Setter Property="BorderThickness"
					Value="1" />
			<Setter Property="CornerRadius"
					Value="5" />
			<Setter Property="BorderBrush"
					Value="Gray" />

		</Style>

		<Style x:Key="fullStretchGridStyle"
			   TargetType="Grid">

			<Setter Property="HorizontalAlignment"
					Value="Stretch" />
			<Setter Property="VerticalAlignment"
					Value="Stretch" />
		</Style>

	</navfx:HostPage.Resources>

	<!-- main layout panel -->
	<Grid x:Name="pageLayout"
		  Style="{StaticResource fullStretchGridStyle}">

		<Grid.RowDefinitions>
			<RowDefinition Height="50" />
			<RowDefinition />
			<RowDefinition Height="150" />
		</Grid.RowDefinitions>

		<Grid.ColumnDefinitions>
			<ColumnDefinition />
		</Grid.ColumnDefinitions>

		<!-- title panel-->
		<Border
				Style="{StaticResource titlePanelStyle}"
				Grid.Row="0"
				Grid.Column="0">

			<StackPanel Orientation="Horizontal">
				<TextBlock Text="NavFx"
						   Style="{StaticResource titleTextStyle}" />
				<TextBlock Text="A Silverlight Navigation Framework"
						   Style="{StaticResource subTitleTextStyle}" />
				<TextBlock Text="VB Demo"
						   Style="{StaticResource versionTextStyle}" />

			</StackPanel>

		</Border>

		<!-- layout for centre row -->
		<!-- tried a stack panel here but they don't do dynamic layout very well in beta 2-->
		<Grid Style="{StaticResource fullStretchGridStyle}"
			  Grid.Column="0"
			  Grid.Row="1">

			<Grid.ColumnDefinitions>
				<ColumnDefinition Width="1*" />
				<ColumnDefinition Width="4*" />
				<ColumnDefinition Width="1.5*" />
			</Grid.ColumnDefinitions>

			<Grid.RowDefinitions>
				<RowDefinition />
			</Grid.RowDefinitions>

			<!-- navigation panel (left side)-->
			<Border Style="{StaticResource panelBorderStyle}"
					Grid.Column="0"
					Grid.Row="0">

				<StackPanel>
					<Button x:Name="home"
							Style="{StaticResource navButtonStyle}">
						<TextBlock Text="Home"
								   Style="{StaticResource buttonTextStyle}" />
					</Button>
					<Button x:Name="external1"
							Style="{StaticResource navButtonStyle}">
						<TextBlock Text="External 1"
								   Style="{StaticResource buttonTextStyle}" />
					</Button>
					<Button x:Name="external2"
							Style="{StaticResource navButtonStyle}" >
						<TextBlock Text="External 2"
								   Style="{StaticResource buttonTextStyle}" />
					</Button>
				</StackPanel>

			</Border>

			<!-- layout grid for options and content panes -->
			<Grid Style="{StaticResource fullStretchGridStyle}"
				  Grid.Column="1"
				  Grid.Row="0">

				<Grid.ColumnDefinitions>
					<ColumnDefinition />
				</Grid.ColumnDefinitions>

				<Grid.RowDefinitions>
					<RowDefinition Height="100" />
					<RowDefinition />
				</Grid.RowDefinitions>

				<!-- options panel (centre top)-->
				<Border Style="{StaticResource panelBorderStyle}"
						Grid.Column="0"
						Grid.Row="0">

					<TextBlock Text="Options"
							   Style="{StaticResource labelStyle}" />
				</Border>

				<!-- page content panel (centre panel)-->
				<Border Style="{StaticResource panelBorderStyle}"
						MinHeight="300"
						Grid.Column="0"
						Grid.Row="1">

					<!-- scrolling panel in case content is too big for window size -->
					<ScrollViewer x:Name="contentViewer"
								  Grid.Column="0"
								  Grid.Row="1"
								  Style="{StaticResource contentViewerStyle}">

						<Grid x:Name="contentPanel"
							  Style="{StaticResource fullStretchGridStyle}">
							<!--
							initially used a StackPanel here
							but they don't do dynamic layout
							very well in beta 2
							-->
						</Grid>

					</ScrollViewer>

				</Border>
			</Grid>

			<!-- watch panel (right side)-->
			<Border Style="{StaticResource panelBorderStyle}"
					Grid.Column="2"
					Grid.Row="0">

				<StackPanel>

					<TextBlock Text="Watch"
							   Style="{StaticResource labelStyle}" />
					<TextBlock Text="Registered Pages:"
							   Style="{StaticResource labelStyle}" />
					<!-- list of registered pages -->
					<ListBox x:Name="registeredPages"
							 Style="{StaticResource registeredPagesStyle}">
					</ListBox>
					<CheckBox x:Name="isPagePinned"
							  IsChecked="False"
							  IsEnabled="False"
							  Style="{StaticResource checkboxStyle}">
						<TextBlock Text="Is Pinned"
								   Style="{StaticResource labelStyle}" />
					</CheckBox>
					<StackPanel Orientation="Horizontal">
						<TextBlock x:Name="pageCountLabel"
								   Style="{StaticResource labelStyle}"
								   Text="Pages:" />
						<TextBlock x:Name="pageCount" />
					</StackPanel>
					
				</StackPanel>

			</Border>
		</Grid>

		<!-- output panel displaying NavFx statements that are executed -->
		<Border x:Name="outputPanel"
				Style="{StaticResource outputPanelStyle}"
				Grid.Row="2"
				Grid.Column="0">
			<ScrollViewer x:Name="outputViewer"
						  HorizontalScrollBarVisibility="Hidden">
				<StackPanel x:Name="outputTextPanel"> 
				</StackPanel>
			</ScrollViewer>
		</Border>
	</Grid>
</navfx:HostPage>
